<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>采购管理</title>


    <!-- Favicon -->
    <link rel="shortcut icon" th:href="@{/assets/media/image/favicon.png}"/>

    <!-- Plugin styles -->
    <link rel="stylesheet" th:href="@{/vendors/bundle.css}" type="text/css">

    <!-- Datepicker -->
    <link rel="stylesheet" th:href="@{/vendors/datepicker/daterangepicker.css}">

    <!-- Vmap -->
    <link rel="stylesheet" th:href="@{/vendors/vmap/jqvmap.min.css}">

    <!-- App styles -->
    <link rel="stylesheet" th:href="@{/assets/css/app.css}" type="text/css">
    <!--弹窗CSS-->
    <link rel="stylesheet" th:href="@{/assets/css/modal.css}" type="text/css">
</head>

<body class="container">
<!--自定义宽度-->
<!-- begin::preloader-->
<div class="preloader">
    <div class="preloader-icon"></div>
</div>
<!-- end::preloader -->

<!-- begin::header -->
<div th:replace="~{commons/header :: header}"></div>
<!-- end::header -->

<!-- begin::main -->
<div id="main">
    <!-- begin::navigation -->
    <div class="navigation">
        <!-- begin::navigation menu -->
        <div th:replace="~{commons/navigation :: navigation}"></div>
        <!-- end::navigation menu -->
    </div>
    <!-- end::navigation -->

    <!-- begin::main-content -->
    <div class="main-content">
        <!-- begin::page content -->
        <div class="container-fluid">
            <!-- begin::采购信息 -->
            <div class="row">
                <div class="col-md-12 card">
                    <div class="row anno">
                        <img th:src="@{/image/anno.png}">
                        采购信息
                    </div>
                    <div class="table-responsive">
                        <table class="table table-striped">
                            <tbody>
                            <tr>
                                <td>报价截止时间：</td>
                                <td th:text="${#dates.format(purchaseMap.get('deadline'),'yyyy-MM-dd HH:mm:ss')}">
                                    2020-7-28
                                </td>
                                <td></td>
                                <td></td>
                            </tr>
                            <tr>
                                <td>单据编号：</td>
                                <td th:text="${purchaseMap.get('document_number')}"></td>
                                <td>申请单位：</td>
                                <td th:text="${purchaseMap.get('company_name')}"></td>
                            </tr>
                            <tr>
                                <td>申请人：</td>
                                <td th:text="${purchaseMap.get('applicant_name')}"></td>
                                <td>签发人：</td>
                                <td th:text="${purchaseMap.get('signer_name')}"></td>
                            </tr>
                            <tr>
                                <td>申请日期：</td>
                                <td th:text="${#dates.format(purchaseMap.get('createdate'),'yyyy-MM-dd HH:mm:ss')}"></td>
                                <td>交货时间：</td>
                                <td th:text="${#dates.format(purchaseMap.get('jhtime'),'yyyy-MM-dd HH:mm:ss')} + '至' + ${#dates.format(purchaseMap.get('jhdeadline'),'yyyy-MM-dd HH:mm:ss')}"></td>
                            </tr>
                            <tr>
                                <td>煤种：</td>
                                <td th:text="${purchaseMap.get('coaltype')} + ${purchaseMap.get('coalclass')}"></td>
                                <td>采购数量：</td>
                                <td th:text="${purchaseMap.get('procurecount')} + '(万吨)'"></td>
                            </tr>
                            <tr>
                                <td>运输方式：</td>
                                <td th:text="${purchaseMap.get('yunshu_mode')}"></td>
                                <td>交货地点：</td>
                                <td th:text="${purchaseMap.get('jiaohuo_mode')}"></td>
                            </tr>
                            <tr>
                                <td>结算方式：</td>
                                <td th:text="${purchaseMap.get('jiesuan_mode')}"></td>
                                <td>验收方式：</td>
                                <td th:text="${purchaseMap.get('yanshou_mode')}"></td>
                            </tr>
                            <tr>
                                <td>最高限价：</td>
                                <td th:text="${purchaseMap.get('maxlimitprice')}"></td>
                                <td>最低限价：</td>
                                <td th:text="${purchaseMap.get('minlimitprice')}"></td>
                            </tr>
                            <tr>
                                <td>结算付款方式：</td>
                                <td th:text="${purchaseMap.get('pay_mode')}"></td>
                                <td></td>
                                <td></td>
                            </tr>
                            </tbody>
                        </table>
                        <div>
                            <label style="padding-left: 10px;">保证金要求：</label>
                            <p style="word-break:break-word; padding-left: 10px;"
                               th:text="${purchaseMap.get('bond_remark')}"></p>
                        </div>
                    </div>
                </div>
            </div>
            <!-- end::采购信息 -->

            <!-- begin::煤质要求 -->
            <div class="row">
                <div class="col-md-12 card">
                    <div class="row anno">
                        <img th:src="@{/image/anno.png}">
                        煤质要求
                    </div>
                    <div class="table-responsive">
                        <table class="table table-striped">
                            <tbody>
                            <tr>
                                <td>收到基基准</td>
                                <td></td>
                                <td></td>
                                <td></td>
                            </tr>
                            <tr>
                                <td>收到基低位发热量Qnetm,ar：</td>
                                <td th:text="${coalQualityMap.get('qnet_ar')}"></td>
                                <td>收到基全硫St,ar(%)≤：</td>
                                <td th:text="${coalQualityMap.get('st_ar')}"></td>
                            </tr>
                            <tr>
                                <td>全水分Mt(%)≤：</td>
                                <td th:text="${coalQualityMap.get('moisture')}"></td>
                                <td>收到基灰分Aar(%)≤：</td>
                                <td th:text="${coalQualityMap.get('aar')}"></td>
                            </tr>
                            <tr>
                                <td>收到基挥发分Var(%)：</td>
                                <td th:text="${coalQualityMap.get('var_s')} + '至' + ${coalQualityMap.get('var_d')}"></td>
                                <td></td>
                                <td></td>
                                <td></td>
                            </tr>
                            <tr>
                                <td>空气干燥基基准</td>
                                <td></td>
                                <td></td>
                                <td></td>
                            </tr>
                            <tr>
                                <td>空干基水分Mad(%)≤：</td>
                                <td th:text="${coalQualityMap.get('mad')}"></td>
                                <td>空干基全硫St,ad(%)≤：</td>
                                <td th:text="${coalQualityMap.get('st_ad')}"></td>
                            </tr>
                            <tr>
                                <td>空干基挥发分Vad(%)：</td>
                                <td th:text="${coalQualityMap.get('vad_s')} + '至' + ${coalQualityMap.get('vad_d')}"></td>
                                <td></td>
                                <td></td>
                            </tr>
                            <tr>
                                <td>干燥基基准</td>
                                <td></td>
                                <td></td>
                                <td></td>
                            </tr>
                            <tr>
                                <td>干基高位发热量：</td>
                                <td th:text="${coalQualityMap.get('qgr_d')}"></td>
                                <td>干基全硫St,d(%)≤：</td>
                                <td th:text="${coalQualityMap.get('st_d')}"></td>
                            </tr>
                            <tr>
                                <td>干燥无灰基挥发分：</td>
                                <td th:text="${coalQualityMap.get('dav_s')} + '至' + ${coalQualityMap.get('dav_d')}"></td>
                                <td>粒度(mm)≤：</td>
                                <td th:text="${coalQualityMap.get('mm')}"></td>
                            </tr>
                            <tr>
                                <td>灰熔点ST(℃)≥：</td>
                                <td th:text="${coalQualityMap.get('st')}"></td>
                                <td>粒度(哈式可磨系数(HGI)≥：</td>
                                <td th:text="${coalQualityMap.get('hgi')}"></td>
                            </tr>
                            </tbody>
                        </table>
                        <div>
                            <label style="padding-left: 10px;">备注：</label>
                            <p style="word-break:break-word; padding-left: 10px;"
                               th:text="${coalQualityMap.get('remark')}"></p>
                        </div>
                    </div>
                </div>
            </div>
            <!-- end::煤质要求 -->

            <!-- begin::查看审核记录 -->
            <div class="row">
                <div class="col-md-12 card">
                    <div class="row anno">
                        <img th:src="@{/image/anno.png}">
                        单据操作记录
                    </div>
                    <div class="table-responsive">
                        <table class="table table-striped">
                            <thead>
                            <tr>
                                <th scope="col">序号</th>
                                <th scope="col">操作人员</th>
                                <th scope="col">单位</th>
                                <th scope="col">操作</th>
                                <th scope="col">审批意见</th>
                                <th scope="col">操作时间</th>
                                <th scope="col">备注</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr th:each="map:${auditRecords}">
                                <td th:text="${mapStat.count}"></td>
                                <td th:text="${map.get('operator_name')}"></td>
                                <td th:text="${map.get('company_name')}"></td>
                                <td th:text="${map.get('operation')}"></td>
                                <td th:if="${map.get('check_opinion')} == ''"></td>
                                <td th:if="${map.get('check_opinion')} == 'agree'">同意</td>
                                <td th:if="${map.get('check_opinion')} == 'rejected'">驳回</td>
                                <td th:text="${#dates.format(map.get('operation_time'),'yyyy-MM-dd HH:mm:ss')}"></td>
                                <td th:text="${map.get('check_remark')}"></td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                <!-- end::查看显示 -->
            </div>
            <!-- end::查看审核记录 -->

            <!-- begin::待审核显示 -->
            <div class="row" th:if="${purchaseMap.get('approval_status') == 'pending'}">
                <form id="purchaseApplyAudit" method="post">
                    <p>备注留言：</p>
                    <textarea id="checkRemark" name="checkRemark" rows="4" cols="103" v-model="text1"></textarea>
                    <br/><br/>
                    <input type="submit" name="resultBtn" class="btn btn-info" onclick="flag = 'agree'"
                           style="margin-left: 200px"
                           value="审核通过"/>
                    <input type="submit" name="resultBtn" class="btn btn-info" onclick="flag = 'rejected'"
                           style="margin-left: 50px"
                           value="驳回"/>
                    <input onclick="javascript:history.go(-1)" type="button" class="btn btn-info"
                           style="margin-left: 50px"
                           value="返回"/>
                </form>
            </div>
            <!-- end::待审核显示 -->
        </div>
        <!-- end::page content -->
        <!-- begin::footer -->
        <footer>
            <div class="container-fluid">
                <div>© 2019 Protable v1.0.0 Made by <a href="http://bootstrapmb.com">Laborasyon</a></div>
                <div>
                    <nav class="nav">
                        <a href="" class="nav-link">Licenses</a>
                        <a href="#" class="nav-link">Change Log</a>
                        <a href="#" class="nav-link">Get Help</a>
                    </nav>
                </div>
            </div>
        </footer>
        <!-- end::footer -->
    </div>
    <!-- end::main-content -->
</div>
<!-- end::main -->
<div th:include="~{commons/scripts :: scripts}"></div>

<!-- App scripts -->
<script th:src="@{/assets/js/app.js}"></script>
<script th:src="@{/assets/js/modal.js}"></script>

<script th:inline="javascript">
    $(() => {
        $('#purchaseApplyAudit').submit(function () {
            var checkRemark = $("#checkRemark").val();   //备注
            //备注信息为空
            if (checkRemark == "" || checkRemark == null) {
                alert("备注信息不能为空！");
                return false;
            } else {
                var data = $("#purchaseApplyAudit").serializeArray();   // 可以增加表单数据
                var operationTime = Math.round(new Date().getTime());  //审核时间
                var operation = "审核";
                var checkOpinion = flag;        //审核意见
                var purchapplyId = [[${purchaseMap.get('purchapply_id')}]];  //采购需求id
                data.push({"name": "operationTime", "value": operationTime});
                data.push({"name": "operation", "value": operation});
                data.push({"name": "checkOpinion", "value": checkOpinion});
                data.push({"name": "purchapplyId", "value": purchapplyId});
                let url = "/purchaseRequest/getDetail/audit";
                $.post(url, data, function (data) {
                    if (data.code == 200) {
                        method = function () {
                            window.location.href = [[${#request.getHeader('Referer')}]]
                        }
                    }else {
                        method = function () {
                            window.location.reload();
                        }
                    }
                    let mModal1 = new mModal({
                        title: "提示", // 标题，默认：提示
                        width: "25%", // 弹出框宽度，默认 25%
                        top: "25vh", // 距离可视区域顶部距离 CSS中 margin-top 值
                        content: data.msg, // 正文，默认：正文内容
                        cancelText: "取 消", // 取消按钮文本
                        confirmText: "确 定", // 确定按钮文本
                        showCancelButton: false, // 是否显示取消按钮
                        showConfirmButton: true, // 是否显示确定按钮
                        showClose: true, // 是否显示关闭按钮
                        modal: true, // 是否需要遮罩层
                        customClass: "", // 自定义类名confirm
                        confirm: function () {
                            mModal1.close();
                            method();
                        },
                    });
                    console.log(111)
                    mModal1.renderDom();
                }, "json")
                return false;
            }
        })
    })
</script>
</body>
</html>